﻿@using PAMD
@using PAMD.Business.Models
@model PAMD.Business.Models.ListingModel
@{
    ViewBag.Title = SiteConstant.Slogan;
    Layout = "../Shared/_Layout.cshtml";
}
@Scripts.Render("~/js/Views/EditListing.js",
                "~/js/Views/jquery.iframe-transport.js",
                "~/js/Views/jquery.fileinput.min.js",
                "~/js/Views/jquery.fileupload.js")
<script language="javascript" type="text/javascript">

    $(document).ready(function (event) {

        $('#calender').button();
        $('#AddSpace').button();

        $('#AddSpace').click(function () {

            var validated = ValidateForm();
            return validated;
        });

    });

</script>
@using (Html.BeginForm("EditSave", "Listing"))
{
    <div class="form-container-small">
        <strong>Add my new space</strong>
        <fieldset class="field-container">
            <div>
                @if (ViewBag.Error != null && ViewBag.Error != "")
                {
                    <div class="red-box">
                        @ViewBag.Error
                    </div>
                }
                <!--  ========================== About parking space header ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <h6>
                            About parking space</h6>
                    </div>
                </div>
                <div class="left-align line-divider-lightblue">
                    &nbsp;
                </div>
                <!--  ========================== Title ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Listing_Title">
                            Title<span class="redLink">*</span>:</label>
                        @Html.TextBoxFor(m => m.Listing.Title, new { validation = "required", @class = "inputBoxSmall left-align", style = "width:300px;" })
                        <div class="information-box-icon left-align">
                            <div class="information-box">
                                e.g. Spacious parking near wembley.</div>
                        </div>
                    </div>
                    <div id="Listing_Title_Error" class="error-box">
                        Please enter space title.
                    </div>
                </div>
                <!--  ==========================  Space category ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Listing_IsPrivate">
                            Space category<span class="redLink">*</span>:</label>
                        @Html.DropDownListFor(m => m.Listing.SpaceCategory, Model.SpaceCategoryList, new { @class = "inputBoxSmall left-align" })
                        <div class="information-box-icon left-align">
                            <div class="information-box">
                                e.g. Driveway or Commercial parking.</div>
                        </div>
                        @Html.CheckBoxFor(m => m.Listing.IsPrivate, new { style = "margin-top:16px;margin-left:30px;", @class = "left-align" })<label
                            for="Listing_IsPrivate" style="width: 130px;">
                            Is this private space?</label>
                    </div>
                </div>
                <!--  ==========================  Vehicle capacity ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Listing_NumberOfSpace">
                            Vehicle capacity<span class="redLink">*</span>:</label>
                        @Html.TextBoxFor(m => m.Listing.NumberOfSpace, new { validation = "required", @class = "inputBoxSmall left-align" })
                        <div class="information-box-icon left-align">
                            <div class="information-box">
                                e.g. How many vehicle can be parked?</div>
                        </div>
                    </div>
                    <div id="Listing_NumberOfSpace_Error" class="error-box">
                        Please enter space capacity i.e 1 or 2 or....
                    </div>
                </div>
                <!--  ==========================  Rental period ==========================   -->
                <fieldset class="left-align boxed">
                    <legend>&nbsp;&nbsp;Rental period&nbsp;&nbsp;</legend>
                    <div class="left-align">
                        @Html.CheckBoxFor(m => m.Listing.Daily, new { style = "margin-top:16px;margin-left:30px;", @class = "left-align" })
                        <label for="Listing_Daily" class="left-text">
                            Daily</label></div>
                    <div class="left-align">
                        @Html.CheckBoxFor(m => m.Listing.Weekly, new { style = "margin-top:16px;margin-left:30px;", @class = "left-align" })
                        <label for="Listing_Weekly" class="left-text">
                            Weekly</label></div>
                    <div class="left-align">
                        @Html.CheckBoxFor(m => m.Listing.Monthly, new { style = "margin-top:16px;margin-left:30px;", @class = "left-align" })
                        <label for="Listing_Monthly" class="left-text">
                            Monthly</label></div>
                    <div class="left-align">
                        @Html.CheckBoxFor(m => m.Listing.Annual, new { style = "margin-top:16px;margin-left:30px;", @class = "left-align" })
                        <label for="Listing_Annual" class="left-text">
                            Annual</label></div>
                    <div class="left-align">
                        @Html.CheckBoxFor(m => m.Listing.OnEventDays, new { style = "margin-top:16px;margin-left:30px;", @class = "left-align" })
                        <label for="Listing_OnEventDays" class="left-text">
                            On event days</label></div>
                    <div class="information-box-icon left-align">
                        <div class="information-box">
                            e.g. Available on certain events days only.</div>
                    </div>
                </fieldset>
                <!--  ==========================  Minimum rental period ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Listing_MinRentalPeriod" style="width: 170px;">
                            Minimum rental period<span class="redLink">*</span>:</label>
                        @Html.DropDownListFor(m => m.Listing.MinRentalPeriod, Model.MinRentalPeriodList, new { validation = "required", @class = "inputAuto left-align" })
                        @Html.DropDownListFor(m => m.Listing.MinRentalPeriodUnit, Model.MinRentalPeriodUnitList, new { validation = "required", @class = "inputSmall left-align" })
                        <div class="information-box-icon left-align">
                            <div class="information-box">
                                e.g. Give minimum rental duration you intend to rent your space.</div>
                        </div>
                    </div>
                    <div id="Listing_MinRentalPeriod_Error" class="error-box">
                        Please enter space capacity i.e 1 or 2 or....
                    </div>
                </div>
                <!--  ========================== Pricing details ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <h6>
                            Pricing details</h6>
                    </div>
                </div>
                <div class="left-align line-divider-lightblue">
                    &nbsp;
                </div>
                <!--  ==========================  Minimum Deposit * £ ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Listing_Deposit" style="width: 130px;">
                            Minimum deposit<span class="redLink">*</span>£</label>
                        @Html.TextBoxFor(m => m.Listing.Deposit, new { validation = "required", @class = "inputSmallest left-align" })
                        <div class="information-box-icon left-align">
                            <div class="information-box" style="margin-left: -100px; margin-top: -80px;">
                                Decide your minimum deposit. You can add multiple prices by clicking on "Add" button.</div>
                        </div>
                    </div>
                    <div id="Listing_Deposit_Error" class="error-box">
                        Please enter minimum deposit amount.
                    </div>
                </div>
                <!--  ==========================  Add prices * £ ============================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Listing_Deposit" style="width: 130px;">
                            Listing Price <span class="redLink">*</span>£</label>
                        <input type="text" class="inputSmallest left-align" id="Price" value="5" />
                        @Html.DropDownList("Duration", Model.MinRentalPeriodUnitList, new { @class = "inputAuto left-align" })
                        @Html.DropDownList("Vehicle", Model.VehicleList, new { @class = "inputAuto left-align" })
                        <input type="button" class="left-align" id="AddPrice" value="Add" style="margin-top: 5px;" />
                        <div class="information-box-icon left-align">
                            <div class="information-box" style="margin-top: -80px;">
                                Decide your price based on type of vehicle parked. You can add multiple prices by
                                clicking on "Add" button.</div>
                        </div>
                    </div>
                    <div id="Price_Error" class="error-box">
                        Please enter listing price.
                    </div>
                </div>
                <div class="left-align">
                    <div class="controlBox">
                        <div id="PriceList" style="margin-left: 130px;">
                        </div>
                    </div>
                </div>
                <!--  ========================== Address details ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <h6>
                            Address details</h6>
                    </div>
                </div>
                <div class="left-align line-divider-lightblue">
                    &nbsp;
                </div>
                <!--  ==========================  Address         ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Address_Line1">
                            Address Line-1<span class="redLink">*</span></label>
                        @Html.TextBoxFor(m => m.Address.Line1, new { validation = "required", @class = "inputBoxSmall left-align" })
                    </div>
                    <div id="Address_Line1_Error" class="error-box">
                        Please enter address line 1.
                    </div>
                </div>
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Address_Line2">
                            Address Line-2</label>
                        @Html.TextBoxFor(m => m.Address.Line2, new { @class = "inputBoxSmall left-align" })
                    </div>
                </div>
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Address_City">
                            City<span class="redLink">*</span></label>
                        @Html.TextBoxFor(m => m.Address.City, new { validation = "required", @class = "inputBoxSmall left-align" })
                    </div>
                    <div id="Address_City_Error" class="error-box">
                        Please enter address city.
                    </div>
                </div>
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Address_County">
                            County<span class="redLink">*</span></label>
                        @Html.TextBoxFor(m => m.Address.County, new { validation = "required", @class = "inputBoxSmall left-align" })
                    </div>
                    <div id="Address_County_Error" class="error-box">
                        Please enter address county.
                    </div>
                </div>
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Country">
                            Country <span class="redLink">*</span></label>
                        @Html.DropDownListFor(m => m.Address.Country, Model.Countries, new { validation = "required", @class = "inputBoxSmall" })
                    </div>
                    <div id="Country_Error" class="error-box">
                        Please select country.
                    </div>
                </div>
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Address_PostCode">
                            Postcode<span class="redLink">*</span></label>
                        @Html.TextBoxFor(m => m.Address.PostCode, new { validation = "required", @class = "inputBoxSmall left-align" })
                    </div>
                    <div id="Address_PostCode_Error" class="error-box">
                        Please enter address county.
                    </div>
                </div>
                <div class="left-align">
                    <div class="controlBox">
                        <img id="imgMap" class="roundimage" alt="Location" style="margin-left: 170px; border-bottom-color:White;"/>
                    </div>
                </div>
                <!--  ========================== Contact details ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <h6>
                            Contact details</h6>
                    </div>
                </div>
                <div class="left-align line-divider-lightblue">
                    &nbsp;
                </div>
                <!--  ==========================  Mobile         ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Listing_ContactNumber">
                            Mobile<span class="redLink">*</span></label>
                        @Html.TextBoxFor(m => m.Listing.ContactNumber, new { validation = "required", @class = "inputBoxSmall left-align" })
                        <div class="information-box-icon left-align">
                            <div class="information-box" style="margin-top: -80px;">
                                Please provide contact details, this could be your personal mobile or landline number.</div>
                        </div>
                    </div>
                    <div id="Listing_ContactNumber_Error" class="error-box">
                        Please enter your contact number.
                    </div>
                </div>
                <!--  ========================== Space description ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <h6>
                            Space description</h6>
                    </div>
                </div>
                <div class="left-align line-divider-lightblue">
                    &nbsp;
                </div>
                <!--  ==========================  Space details         ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <label for="Listing_SpaceDescription">
                            Tell more<span class="redLink">*</span></label>
                        @Html.TextAreaFor(m => m.Listing.SpaceDescription, new { validation = "required", @class = "left-align", style = "margin-top:20px; height:100px; width:400px;" })
                        <div class="information-box-icon left-align">
                            <div class="information-box" style="margin-top: -135px; margin-left: -450px;">
                                Please provide possible description/details of the parking space. e.g. 5-10 minutes
                                walk to stadium on the Wembley Stadium Estate ideal location for a quick getaway
                                to the A406 and all major routes.</div>
                        </div>
                    </div>
                    <div id="Listing_SpaceDescription_Error" class="error-box">
                        Please describe your parking drive information in details here.
                    </div>
                </div>
                <!--  ========================== Upload pictures title ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <h6>
                            Upload pictures</h6>
                    </div>
                </div>
                <div class="left-align line-divider-lightblue">
                    &nbsp;
                </div>
                <!--  ==========================  Upload pictures         ==========================   -->
                <div class="left-align">
                    <div class="controlBox">
                        <input id="fileupload" type="file" name="files" />
                        <div id="fileProgress" style="display: none; float: left; padding: 3px; width: 20px;
                            height: 20px">
                            <img src='@Url.Content("~/img/spinner.gif")' alt="Uploading..." />
                        </div>
                        <div id="file_Error" class="error-box" style="width: 450px; display: none;">
                            <div id="fileError">
                                &nbsp;</div>
                        </div>
                    </div>
                    <div class="information-box-icon left-align" style="margin-top: 10px; margin-left: -500px;">
                        <div class="information-box" style="margin-top: -60px; margin-left: -50px;">
                            Add atleast one picture of your parking drive.</div>
                    </div>
                </div>
                <div class="left-align">
                    <div class="controlBox">
                        <div id="fileResult" style="max-height: 150px; overflow: auto;">
                            &nbsp;</div>
                    </div>
                </div>
                <div class="left-align">
                    &nbsp;
                </div>
                <div class="left-align">
                    <label for="">
                        &nbsp;
                    </label>
                    <input type="submit" id="AddSpace" style="margin-left: 100px;" value="Add Space" />
                   @Html.HiddenFor(m => m.PriceListFinal)
                   @Html.HiddenFor(m => m.FileList)
                    @Html.HiddenFor(m => m.Listing.ID)
                </div>
            </div>
        </fieldset>
    </div>
}